<template>
	<view>
		<view v-if="showTips" class="fixed bgFF radio30  tips fs28 color02">
			<view class="lh50">
				{{actionPermission.title}}使用说明：
			</view>
			<view class="lh50">
				{{actionPermission.tips}}
			</view>
		</view>
		<uni-popup ref="popup" @close="close" mode="top" round="30rpx">
			<view class="padding50 bgFF content text-center radio20 fs32 color">
				<view class="wh100">
					<view class="lh50 marginB40">
						您已禁止{{actionPermission.title}},如需要使用请设置！
					</view>
					<view @click="handelAllow" class="fw600 paddingT40 borderT1">
						去设置
					</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import {
		tipsConfig
	} from './index.js'
	import permision from './permission.js'
	export default {
		data() {
			return {
				key: 'CAMERA',
				// isSetting: false,
				showTips: false
			}
		},
		computed: {
			actionPermission() {
				return tipsConfig[this.key]
			}
		},
		methods: {
			async showView(key = 'CAMERA', callback) {
				uni.removeStorageSync('permission')
				// #ifdef APP-PLUS
				// 获取系统信息
				const systemInfo = uni.getSystemInfoSync();
				// 判断是否为ios
				const isIos = systemInfo?.platform === 'ios';
				if (isIos) {
					return callback && callback()
				}
				this.key = key
				// 如果返回1 则是允许权限 直接调用回调就行 如果是0则询问 -1则永久拒绝
				const permission = uni.getStorageSync('permission') || {}
				const keyStatus = permission[this.actionPermission?.key] || null
				if (keyStatus == 1) {
					return callback && callback()
				}
				const result = await this.requestAndroidPermission()
				permission[this.actionPermission?.key] = result
				uni.setStorageSync('permission', permission)
				if (result == 1) {
					callback && callback()
				} else {
					this.$refs.popup.open('top')
				}
				//#endif
				// #ifndef APP-PLUS
				callback && callback()
				//#endif
			},
			close() {
				this.$refs.popup.open('top')
				this.showTips = false
			},
			/**
			 * 禁止
			 */
			handelProhibited(status) {
				this.close()
			},
			/**
			 * 允许
			 */
			handelAllow() {
				this.$refs.popup.close()
				permision.gotoAppPermissionSetting()
			},
			async requestAndroidPermission() {
				this.showTips = true
				return await permision.requestAndroidPermission(this.actionPermission.permission, () => {
					this.showTips = false
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.tips-box {
		left: 0;
		top: 0;
		width: 100vw;
		height: 100vh;
	}

	.tips {
		width: 80vw;
		padding: 30rpx 70rpx;
		left: 50%;
		top: 5vh;
		transform: translateX(-50%);
		z-index: 10076;
		box-shadow: 0px 2px 10px 1px rgba(0, 0, 0, 0.1);
		box-sizing: border-box;
	}

	/deep/ .u-popup__content {
		background-color: transparent;
	}

	.content {
		width: 80vw;
		margin: 0 auto;
	}

	.color {
		color: #4994F6;
	}

	.action::before {
		content: '';
		width: 4rpx;
		height: 100%;
		position: absolute;
		left: 50%;
		top: 0;
		transform: translateX(-50%);
		background-color: #D9D9D9;
	}

	.fixed {
		position: fixed;
	}

	.bgFF {
		background-color: #fff;
	}

	.radio30 {
		border-radius: 30rpx;
	}

	.absolute {
		position: absolute;
	}

	.fs28 {
		font-size: 28rpx;
	}

	.color02 {
		color: #333;
	}

	.padding50 {
		padding: 50rpx;
	}

	.text-center {
		text-align: center;
	}

	.radio20 {
		border-radius: 20rpx;
	}

	.fs32 {
		font-size: 32rpx;
	}
</style>